function IS_Coords(coord) {
    //不是数组
    if (!Array.isArray(coord)) {
        return false
    }

    //判断是坐标还是坐标集
    if (Array.isArray(coord[0])&&coord[0].some(i => Array.isArray(i))) {//三层坐标集
        for (let i = 0; i < coord[0].length; i++) {
            const item = coord[0][i];
            if (!Array.isArray(item) || item.length != 2) {
                return false;
            }
            const longitude = item[0]; //维度
            const latitude = item[1]; //维度
            
            const isLongitudeValid = longitude >= -180 && longitude <= 180
            const isLatitudeValid = latitude >= -90 && latitude <= 90

            if (!isLongitudeValid || !isLatitudeValid) {
                return false
            }
        }
        return true;
    } else if (coord.some(i => Array.isArray(i))) {//坐标集
        for (let i = 0; i < coord.length; i++) {
            const item = coord[i];
            if (!Array.isArray(item) || item.length != 2) {
                return false;
            }
            const longitude = item[0]; //维度
            const latitude = item[1]; //维度
            
            const isLongitudeValid = longitude >= -180 && longitude <= 180
            const isLatitudeValid = latitude >= -90 && latitude <= 90

            if (!isLongitudeValid || !isLatitudeValid) {
                return false
            }
        }
        
        return true;
    } else {
        if (coord.length != 2) {
            return false
        }
        const longitude = coord[0]; //维度
        const latitude = coord[1]; //维度

        const isLongitudeValid = longitude >= -180 && longitude <= 180
        const isLatitudeValid = latitude >= -90 && latitude <= 90
        if (!isLongitudeValid || !isLatitudeValid) {
            return false
        }
        return true;
    }


}
const Save = {
    data() {
        return {
            dataForm: {},
            childDataForm: [{}],
            action: '',
            nodeKey: '',
            loading: false,
            relativePath: '',
        };
    },
    mounted() {
        let ls_URL = window.location.href;
        this.nodeKey = getQueryObject(ls_URL, "nodeKey");// 获取 nodeKey 参数
        this.action = getQueryObject(ls_URL, "action");   // 获取 action 参数
        this.relativePath = ls_URL.substring(
            ls_URL.lastIndexOf("view"),
            ls_URL.length
        );
        if (this.action === 'Modify' && this.nodeKey) {
            this.getData(this.nodeKey);
        }
    },
    computed: {
        numberToChinese() {
            return function (num) {
                if (isNaN(num) || num < 0 || num > 999999999999) {
                    return '无效数字';
                }
                const chineseNums = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九'];
                const chineseUnits = ['', '十', '百', '千', '万', '十', '百', '千', '亿', '十', '百', '千'];

                let str = '';
                let unitPos = 0;
                let needZero = false;

                if (num === 0) {
                    return chineseNums[0];
                }

                while (num > 0) {
                    const digit = num % 10;
                    if (digit === 0) {
                        if (!needZero && unitPos % 4 !== 0) {
                            needZero = true;
                        }
                    } else {
                        if (needZero) {
                            str = chineseNums[0] + str;
                            needZero = false;
                        }
                        str = chineseNums[digit] + chineseUnits[unitPos] + str;
                    }
                    num = Math.floor(num / 10);
                    unitPos++;
                }

                // 处理"一十"开头的特殊情况，通常简化为"十"
                if (str.startsWith('一十')) {
                    str = str.substring(1);
                }

                return str;
            }
        },
        chineseToArabic() {
            return function (chineseNum) {
                const chineseDigits = {
                    '零': 0, '一': 1, '二': 2, '三': 3, '四': 4,
                    '五': 5, '六': 6, '七': 7, '八': 8, '九': 9
                };

                const chineseUnits = {
                    '十': 10, '百': 100, '千': 1000, '万': 10000,
                    '亿': 100000000, '兆': 1000000000000
                };

                let result = 0;
                let temp = 0;
                let section = 0;

                for (let i = 0; i < chineseNum.length; i++) {
                    const char = chineseNum[i];

                    if (chineseDigits[char] !== undefined) {
                        temp = chineseDigits[char];
                    } else if (chineseUnits[char] !== undefined) {
                        // 处理"一十"这样的特殊情况
                        if (temp === 0 && char === '十') {
                            temp = 1;
                        }

                        const unit = chineseUnits[char];

                        if (unit >= 10000) {
                            // 处理万、亿等大单位
                            section += temp;
                            result += section * unit;
                            section = 0;
                            temp = 0;
                        } else {
                            // 处理十、百、千
                            temp = temp === 0 ? unit : temp * unit;
                            section += temp;
                            temp = 0;
                        }
                    }
                }
                result += section + temp;
                return result;
            }
        }
    },
    methods: {
        ID_Validity(rule, value, callback) {//校验身份证号
            if (!value) {
                callback(new Error('请输入身份证'));
            } else if (!ID_Validity(value)) {
                callback(new Error('身份证格式不正确'));
            } else {
                callback();
            }
        },
        PH_Validity(rule, value, callback) { //校验手机号
            const flexibleRegex = /^\d{3,4}[- ]?\d{7,8}$/;
            
            if (!value) {
                callback(new Error('请输入联系电话'));
            } else if (!validatemobile(value)&&!flexibleRegex.test(value)) {
                callback(new Error('联系电话格式不正确'));
            } else {
                callback();
            }
        },
        ID_Business(rule, value, callback) { //校验营业执照
            if (!value) {
                callback(new Error('请输入营业执照'));
            } else if (!ID_Business(value)) {
                callback(new Error('营业执照格式不正确'));
            } else {
                callback();
            }
        },
        IS_Coords(rule, value, callback) { //经纬度
            let coord = [];
            try {
                coord = JSON.parse(value);
            } catch (error) {
                callback(new Error('无效坐标点格式'));
            }
            if (!value) {
                callback(new Error('请输入经纬度'));
            } else if (!IS_Coords(coord)) {
                callback(new Error('无效经纬度,格式[经度,纬度]'));
            } else {
                callback();
            }
        },
        getData(nodeKey) {//查询
            const that = this;
            //获取对应子表表单对象
            let lJSONObject_Children = new Array();
            let lJSONObject_ChildData = new Object();
            try {
                //可能涉及多个子表
                document.getElementById("ChildTable").querySelectorAll(".el-descriptions").forEach(item => {
                    let lJSONObject_ChildData_Options = new Object();
                    lJSONObject_ChildData_Options = JSON.parse(item.getAttribute("data-options"));

                    let ls_ChildTableName = lJSONObject_ChildData_Options.TableName;
                    let ls_ChildDataForm = lJSONObject_ChildData_Options.form;

                    lJSONObject_ChildData[ls_ChildTableName] = ls_ChildDataForm;
                    lJSONObject_Children[ls_ChildTableName] = 'ChildTable';
                })
            } catch (error) { }
            //获得对应表单对象
            try {
                let lJSONObject_Data_Options = new Object();
                lJSONObject_Data_Options = JSON.parse(document.getElementById("MainTable").getAttribute("data-options"));
                let ls_DataForm = lJSONObject_Data_Options.form;
                let ls_TableName = lJSONObject_Data_Options.TableName;
                let ls_primary_key = lJSONObject_Data_Options.primary_key

                let lJSONObject_Data = new Object();
                lJSONObject_Data[ls_TableName] = ls_DataForm;
                lJSONObject_Data = { ...lJSONObject_Data, ...lJSONObject_ChildData };

                let lJSONObject_TableName = new Object();
                lJSONObject_TableName[ls_TableName] = 'MainTable'
                lJSONObject_TableName = { ...lJSONObject_TableName, ...lJSONObject_ChildData };
                for (let key in lJSONObject_TableName) {
                    $.ajax({
                        headers: requestHeaders(),
                        url: `${mh}/generalBusiness/generalQueryByTableNameWithOriginal`,
                        method: "post",
                        data: {
                            Data: key,
                            Condition: `${ls_primary_key}='${nodeKey}'`,
                        },
                        success: (res) => {
                            if (lJSONObject_TableName[key] == 'MainTable') {
                                that[lJSONObject_Data[key]] = res[0];
                            } else {
                                that[lJSONObject_Data[key]] = res;
                            }
                        },
                        complete: (XMLHttpRequest) => {
                            requestPretreatment(XMLHttpRequest)
                        },
                    });
                }
            } catch (error) { }
        },
        //校验当前页面有没有form校验未通过
        async validateAllForms() {
            //获取当前页面上所有的Elform
            let forms = [];
            for (let key in this.$refs) {
                const ref = this.$refs[key];
                if (ref.$options && ref.$options.name == 'ElForm') {
                    forms.push(ref);
                }
            }
            //判断每个Elform的校验是否通过
            let isfail = false;
            for (const form of forms) {
                try {
                    await form.validate();
                } catch (error) {
                    isfail = true;
                }
            }
            if (isfail) {
                return false;
            }
            return true;
        },
        //提交表单
        async handleSubmit() {
            const allValid = await this.validateAllForms();
            if (allValid) {
                this.loading = true;
                let ls_URL = window.location.href;
                const action = getQueryObject(ls_URL, "action");   // 获取 action 参数
                let lJSONObject_Data_Options = new Object();
                lJSONObject_Data_Options = JSON.parse(document.getElementById("MainTable").getAttribute("data-options"));

                let ls_MainTableName = lJSONObject_Data_Options.TableName;
                let ls_DataForm = lJSONObject_Data_Options.form;
                let ls_primary_key = lJSONObject_Data_Options.primary_key;
                //没有子表下面内容就会报错，try/catch抛出异常
                try {
                    //可能涉及多个子表
                    document.getElementById("ChildTable").querySelectorAll(".el-descriptions").forEach(item => {
                        if (item.hasAttribute('data-options')) {
                            let lJSONObject_ChildData_Options = new Object();
                            lJSONObject_ChildData_Options = JSON.parse(item.getAttribute("data-options"));

                            let ls_ChildTableName = lJSONObject_ChildData_Options.TableName;
                            let ls_ChildDataForm = lJSONObject_ChildData_Options.form;
                            // let ls_ParentTableName = lJSONObject_ChildData_Options.ParentTableName;
                            if (this[ls_DataForm][ls_primary_key]) {
                                this[ls_ChildDataForm].forEach(item => {
                                    item[ls_primary_key] = this[ls_DataForm][ls_primary_key];
                                })
                            }
                            //建立子表结构体
                            let JSONArray_ChildRecord = new Array();
                            JSONArray_ChildRecord = this[ls_ChildDataForm];
                            if (!this[ls_DataForm].Children) {
                                this[ls_DataForm].Children = new Object();
                            }
                            this[ls_DataForm].Children[ls_ChildTableName] = JSONArray_ChildRecord;
                        }
                    })
                } catch (error) {

                }
                //建立新增提交结构
                let lJSONObject_DataSet = new Object();
                if (action == 'Add') {
                    if (this.nodeKey) {
                        this[ls_DataForm].Parent_SerialNumber = this.nodeKey;
                    }
                    let lJSONArray_Record = new Array();
                    lJSONArray_Record.push(this[ls_DataForm]);
                    let lJSONObject_Table = new Object();
                    lJSONObject_Table[ls_MainTableName] = lJSONArray_Record;
                    lJSONObject_DataSet[action] = lJSONObject_Table;
                } else if (action == 'Modify') {
                    const { add, modify } = this.deal(this[ls_DataForm]);
                    let lJSONArray_Record = new Array();
                    lJSONArray_Record.push(modify);

                    let lJSONObject_Table = new Object();
                    lJSONObject_Table[ls_MainTableName] = lJSONArray_Record;

                    lJSONObject_DataSet[action] = lJSONObject_Table;
                    lJSONObject_DataSet['Add'] = new Object();
                    if (add != null) {
                        let lJSONArray_Record_Add = new Array();
                        lJSONArray_Record_Add.push(add);

                        let lJSONObject_Table_Add = new Object();
                        lJSONObject_Table_Add[ls_MainTableName] = lJSONArray_Record_Add;

                        lJSONObject_DataSet['Add'] = lJSONObject_Table_Add;
                    }
                }
                let Operation_Main = JSON.stringify(deepClone(lJSONObject_DataSet));
                lJSONObject_DataSet['Add']['base_operation_log'] = [{
                    Operation_Type: '0',
                    Operation_Path: this.relativePath,
                    Operation_Main,
                    Operation_Interface: "generalSaveByRequestBody",
                    Operation_IP: getIpAddress()
                }]
                submitSave(lJSONObject_DataSet, (res) => {
                    if (res.Status == 'success') {
                        window.location.href = './index.html'
                    }
                    this.loading = false;
                })
                // $.ajax({
                //     headers: requestHeaders("JSON"),
                //     url: `${mh}/generalBusiness/generalSaveByRequestBody`,
                //     method: "post",
                //     data: JSON.stringify({
                //         Data: lJSONObject_DataSet,
                //     }),
                //     success: (res) => {
                //         if (res.Status == 'success') {
                //             window.location.href = './index.html'
                //             // window.history.go(-1);
                //         }
                //     },
                //     complete: (XMLHttpRequest) => {
                //         this.loading = false;
                //         requestPretreatment(XMLHttpRequest)
                //     }
                // });
            } else {
                this.$message({
                    message: '存在未填写的必填项！',
                    type: 'warning'
                });
            }
        },
        deal(form) {    //将待提交的数据中添加和修改分离出来
            const add = deepClone(form), modify = deepClone(form);
            try {
                for (let key in form.Children) {
                    let add_Data = [], modify_Data = [];
                    for (const i in modify.Children[key]) {
                        const obj = modify.Children[key][i];
                        if (!Object.keys(obj).some(item => item.includes('_Original'))) {
                            add_Data.push(obj);
                        } else {
                            modify_Data.push(obj);
                        }
                    }
                    add.Children[key] = add_Data;
                    modify.Children[key] = modify_Data;
                }
                let lb_is = true;
                for (let key in add.Children) {
                    if (add.Children[key].length > 0) {
                        lb_is = false;
                    }
                }
                if (lb_is) {
                    return { add: null, modify };
                }
                return { add, modify };
            } catch (error) {
                return { add: null, modify };
            }
        },
        handleAdd(formName) {
            if (this.action === 'Add') {
                this[formName].push({})
            } else if (this.action === 'Modify') {
                let lJSONObject_Data_Options = new Object();
                lJSONObject_Data_Options = JSON.parse(document.getElementById("MainTable").getAttribute("data-options"));
                let ls_primary_key = lJSONObject_Data_Options.primary_key;
                let lJSONObject_Data = new Object();
                lJSONObject_Data[ls_primary_key] = this.nodeKey;
                this[formName].push(lJSONObject_Data);
            }
        },
        handleRemove(formName, min = 1) {
            if (this.action === 'Add') {
                if (this[formName].length > min) {
                    this[formName].pop();
                } else {
                    this.$message({
                        message: '不能在删除了',
                        type: 'warning'
                    })
                }
            } else if (this.action === 'Modify') {
                if (this[formName].filter(item => item.Row_Status != '1').length > min) {
                    let i = this[formName].filter(item => item.Row_Status != '1').length - 1
                    let obj = this[formName].filter(item => item.Row_Status != '1')[i]
                    if (!Object.keys(obj).some(item => item.includes('_Original'))) {
                        this[formName].pop();
                    } else {
                        this.$confirm('该操作将删除此条数据,是否继续?', '提示', {
                            confirmButtonText: '确定',
                            cancelButtonText: '取消',
                            type: 'warning',
                        }).then(() => {
                            this[formName].filter(item => item.Row_Status != '1')[i].Row_Status = '1'
                        }).catch(() => {
                            this.$message({
                                type: 'warning',
                                message: '已取消删除'
                            });
                        });
                    }
                } else {
                    this.$message({
                        message: '不能在删除了',
                        type: 'warning'
                    })
                }
            }
        },
        goBack() {
            window.history.back();
        },

    },
};
const Query = {
    data() {
        return {
            photo,
            treeData: [], //树的数据
            columns: [], //表格的列
            loading: false, //表数据的懒加载
            showDialog: false, //设置字段弹窗
            checkedFields: [], //选中的字段
            Tabletdata: [], //表格的数据
            fields: [], //字段列表
            Total: 0,
            page: {
                PageNumber: 1, //页码
                RowAmount: 10,
                Condition1: "",
            },
            key: '',
            type: 0,
            relativePath: '',
            multipleSelection: [],
            websocket: null,
        };
    },
    mounted() {
        // this.submitSave();
        let currentURL = window.location.href;
        currentURL = currentURL.replace(/([?&])ACCESSTOKEN=[^&]*(&|$)/, '$1').replace(/[?&]$/, '')
        this.relativePath = currentURL.substring(
            currentURL.lastIndexOf("view"),
            currentURL.length
        );
        this.Treedata();
        this.getList();
    },
    computed: {
        // 计算属性，返回选中的字段
        isAllChecked() {
            return this.checkedFields.length === this.fields.length;
        },
        isValueType() {
            return function (str) {
                if (str.toLowerCase().includes('.png') || str.toLowerCase().includes('.jpg') || str.toLowerCase().includes('.jpeg') || str.toLowerCase().includes('.webp') || str.toLowerCase().includes('.jfif')) {
                    return "image";
                } else if (str.toLowerCase().includes('.mp4') && !str.toLowerCase().includes('/nginx')) {
                    return "video";
                } else {
                    return "";
                }
            }
        }
    },
    methods: {
        // submitSave() {
        //     this.websocket = new WebSocketClient();
        //     this.websocket.init({
        //         url: `${ws}/generalSave/${getCookie('token')}`,
        //         onopen: () => {
        //             console.log('websocket已开启');
        //         },
        //         onmessage: (data) => {
        //             try {
        //                 const res = JSON.parse(data);
        //                 if (res.REDIRECT && res.REDIRECT == 'REDIRECT') {//重定向
        //                     removeCookie("token");
        //                     removeCookie("user");
        //                     sessionStorage.setItem("REDIRECT", "登录已过期，请重新登录！");
        //                     window.parent.document.location.href = absolutepath() + res.CONTENTPATH;
        //                 } else {
        //                     if (res.Action == 'Delete') {//删除
        //                         if (res.Status == 'success') {
        //                             this.postgetList(this.page);
        //                         } else {
        //                             this.$message({
        //                                 type: 'error',
        //                                 message: '删除失败'
        //                             });
        //                         }
        //                     }
        //                 }
        //             } catch (error) { }
        //         },
        //     })
        //     window.addEventListener("beforeunload", () => {
        //         this.websocket.close();
        //     });
        // },
        handleSizeChange(newSize) {
            this.page.PageNumber = 1;
            this.page.RowAmount = newSize;
            this.postgetList(this.page);
        },
        handleCurrentChange(newPage) {
            this.page.PageNumber = newPage;
            this.postgetList(this.page);
        },
        //树的数据
        Treedata() {
            try {
                let { TableName, NodeCode } = JSON.parse(document.getElementById("tree").getAttribute("data-options"));
                $.ajax({
                    headers: requestHeaders(),
                    url: `${mh}/generalBusiness/generalQueryForObtainingTrees`,
                    type: "GET",
                    data: {
                        TableName,
                        NodeCode
                    },
                    success: (data) => {
                        this.treeData = data; // 直接使用 this
                    },
                    complete: (XMLHttpRequest) => {
                        requestPretreatment(XMLHttpRequest)
                    },
                    dataType: "json",
                });
            } catch (error) {

            }
        },
        //添加按钮 树
        personalAdds(row) {
            let { primary_key } = JSON.parse(document.getElementById("tree").getAttribute("data-options"));
            window.location.href = "./addtree.html?action=Add" + (row ? "&nodeKey=" + row[primary_key] : "");
        },
        //编辑按钮 树
        handleEdits(row) {
            let { primary_key } = JSON.parse(document.getElementById("tree").getAttribute("data-options"));
            window.location.href = "./addtree.html?action=Modify&nodeKey=" + row[primary_key];
        },
        // 树删除
        remove(node, data) {
            this.$confirm('该操作将删除此条数据,是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning',
            }).then(() => {
                data.Row_Status = '1';
                let { TableName } = JSON.parse(document.getElementById("tree").getAttribute("data-options"));
                let lJSONObject_DataSet = new Object();
                let lJSONArray_Record = new Array();
                lJSONArray_Record.push(data);
                let lJSONObject_Table = new Object();
                lJSONObject_Table[TableName] = lJSONArray_Record;
                lJSONObject_DataSet['Modify'] = lJSONObject_Table;
                let Operation_Main = JSON.stringify(deepClone(lJSONObject_DataSet));
                lJSONObject_DataSet['Add'] = new Object();
                lJSONObject_DataSet['Add']['base_operation_log'] = [{
                    Operation_Type: '0',
                    Operation_Path: this.relativePath,
                    Operation_Main,
                    Operation_Interface: "generalSave",
                    Operation_IP: getIpAddress()
                }]
                submitSave(lJSONObject_DataSet, (res) => {
                    if (res.Status == 'success') {
                        this.Treedata();
                    } else {
                        this.$message({
                            type: 'error',
                            message: '删除失败'
                        });
                    }
                })
                // $.ajax({
                //     headers: requestHeaders(),
                //     url: `${mh}/generalBusiness/generalSave`,
                //     method: "post",
                //     data: {
                //         Data: JSON.stringify(lJSONObject_DataSet),
                //     },
                //     success: (res) => {
                //         if (res.Status == 'success') {
                //             this.Treedata();
                //         } else {
                //             this.$message({
                //                 type: 'error',
                //                 message: '删除失败'
                //             });
                //         }
                //     },
                //     complete: (XMLHttpRequest) => {
                //         requestPretreatment(XMLHttpRequest)
                //     },
                // });
            }).catch(() => { });
        },
        getList() {
            const that = this;
            try {
                const { TableName } = JSON.parse(document.getElementById("table").getAttribute("data-options"));
                $.ajax({
                    headers: requestHeaders(),
                    url: `${mh}/generalBusiness/generalQueryBySQLSerialNumber`,
                    method: "post",
                    data: {
                        SQLSerialNumber: 's_base_sql_table_config',
                        Condition: window.btoa(unescape(encodeURIComponent("%" + this.relativePath + "%"))),
                        ExtensionCondition: '',
                    },
                    success: (data) => {
                        if (data.length > 0) {
                            that.columns = data;
                            that.checkedFields = data;
                            that.fields = data;
                            that.loading = true;
                            that.postgetList(that.page);
                        } else {
                            that.type = 1;
                            $.ajax({
                                headers: requestHeaders(),
                                url: `${mh}/generalBusiness/generalQueryAllColumnByTableName`,
                                method: "get",
                                data: {
                                    Data: TableName,
                                },
                                success: (res) => {
                                    let PRI = res.filter(item => item.COLUMN_KEY == 'PRI');
                                    console.log(PRI);
                                    if (PRI.length > 0) {
                                        this.key = PRI[0].COLUMN_NAME;
                                    }
                                    let data = res.filter(item => item.COLUMN_COMMENT && item.COLUMN_NAME != "Row_Status");
                                    that.columns = data;
                                    that.checkedFields = data;
                                    that.fields = data;
                                    that.loading = true;
                                    that.postgetList(that.page);
                                },
                                complete: (XMLHttpRequest) => {
                                    requestPretreatment(XMLHttpRequest)
                                },
                            });
                        }
                    },
                    complete: (XMLHttpRequest) => {
                        requestPretreatment(XMLHttpRequest)
                    },
                });
            } catch (error) {

            }

        },
        //获取表格的数据
        postgetList(page) {
            const { TableName } = JSON.parse(document.getElementById("table").getAttribute("data-options"));
            const that = this;
            if (this.type) {
                $.ajax({
                    headers: requestHeaders(),
                    url: `${mh}/generalBusiness/generalPaginateQueryByTableName`,
                    method: "post",
                    data: {
                        Data: TableName,
                        Condition: "Row_Status='0'" + page.Condition1,
                        PaginationNumber: page.PageNumber,
                        ...page
                    },
                    success: (res) => {
                        that.Total = res.Total;//总数量
                        that.loading = false;
                        that.Tabletdata = res.Rows;
                    },
                    complete: (XMLHttpRequest) => {
                        requestPretreatment(XMLHttpRequest)
                    },
                });
            } else {
                $.ajax({
                    headers: requestHeaders(),
                    url: `${mh}/generalBusiness/generalPaginationQueryBySQLSerialNumber`,
                    method: "post",
                    data: {
                        Model_Url: this.relativePath,
                        Condition: page.Condition,
                        PaginationNumber: page.PageNumber,
                        ...page
                    },
                    success: (res) => {
                        that.Total = res.TotalRows;//总数量
                        that.loading = false;
                        that.Tabletdata = res.Rows;
                        let lJSONObject_DataSet = {
                            Add: {
                                base_operation_log: [{
                                    Operation_Type: '0',
                                    Operation_Path: this.relativePath,
                                    Operation_Main: JSON.stringify(deepClone({
                                        Data: res.Rows,
                                        Param: {
                                            Model_Url: this.relativePath,
                                            Condition: page.Condition,
                                            PaginationNumber: page.PageNumber,
                                            ...page
                                        }
                                    })),
                                    Operation_Interface: "generalPaginationQueryBySQLSerialNumber",
                                    Operation_IP: getIpAddress()
                                }]
                            }
                        }
                        submitSave(lJSONObject_DataSet);
                        // this.websocket.send(JSON.stringify({ Data: lJSONObject_DataSet, Action: 'Log', AccessToken: getCookie('token') }));
                        // $.ajax({
                        //     headers: requestHeaders("JSON"),
                        //     url: `${mh}/generalBusiness/generalSaveByRequestBody`,
                        //     method: "post",
                        //     data: JSON.stringify({
                        //         Data: {
                        //             Add: {
                        //                 base_operation_log: [{
                        //                     Operation_Type: '0',
                        //                     Operation_Path: this.relativePath,
                        //                     Operation_Main: JSON.stringify(deepClone({
                        //                         Data: res.Rows,
                        //                         Param: {
                        //                             Model_Url: this.relativePath,
                        //                             Condition: page.Condition,
                        //                             PaginationNumber: page.PageNumber,
                        //                             ...page
                        //                         }
                        //                     })),
                        //                     Operation_Interface: "generalPaginationQueryBySQLSerialNumber",
                        //                     Operation_IP: getIpAddress()
                        //                 }]
                        //             }
                        //         },
                        //     }),
                        //     complete: (XMLHttpRequest) => {
                        //         requestPretreatment(XMLHttpRequest)
                        //     }
                        // });
                    },
                    complete: (XMLHttpRequest) => {
                        requestPretreatment(XMLHttpRequest)
                    },
                });
            }
        },
        //添加按钮
        personalAdd() {
            window.location.href = "./add.html?action=Add";
        },
        //编辑按钮
        handleEdit(row) {
            let { primary_key } = JSON.parse(document.getElementById("table").getAttribute("data-options"));
            window.location.href = "./add.html?action=Modify&nodeKey=" + row[primary_key];
        },
        //删除数据
        handleDelete(data) {
            this.$confirm('该操作将删除此条数据,是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning',
            }).then(() => {
                let { TableName, primary_key } = JSON.parse(document.getElementById("table").getAttribute("data-options"));
                $.ajax({
                    headers: requestHeaders(),
                    url: `${mh}/generalBusiness/generalQueryByTableNameWithOriginal`,
                    method: "post",
                    data: {
                        Data: TableName,
                        Condition: primary_key + "='" + data[primary_key] + "'"
                    },
                    success: (res) => {
                        if (res.length == 1) {
                            res[0].Row_Status = '1';
                            let lJSONObject_DataSet = new Object();
                            let lJSONObject_Table = new Object();
                            lJSONObject_Table[TableName] = res;
                            lJSONObject_DataSet['Modify'] = lJSONObject_Table;
                            let Operation_Main = JSON.stringify(deepClone(lJSONObject_DataSet));
                            lJSONObject_DataSet['Add'] = new Object();
                            lJSONObject_DataSet['Add']['base_operation_log'] = [{
                                Operation_Type: '0',
                                Operation_Path: this.relativePath,
                                Operation_Main,
                                Operation_Interface: "generalSaveByRequestBody",
                                Operation_IP: getIpAddress()
                            }]
                            submitSave(lJSONObject_DataSet, (res) => {
                                if (res.Status == 'success') {
                                    this.postgetList(this.page);
                                } else {
                                    this.$message({
                                        type: 'error',
                                        message: '删除失败'
                                    });
                                }
                            })
                            // this.websocket.send(JSON.stringify({ Data: lJSONObject_DataSet, Action: 'Delete', AccessToken: getCookie('token') }));
                            // $.ajax({
                            //     headers: requestHeaders(JSON),
                            //     url: `${mh}/generalBusiness/generalSaveByRequestBody`,
                            //     method: "post",
                            //     data: JSON.stringify({
                            //         Data: lJSONObject_DataSet,
                            //     }),
                            //     success: (res) => {
                            //         if (res.Status == 'success') {
                            //             this.postgetList(this.page);
                            //         } else {
                            //             this.$message({
                            //                 type: 'error',
                            //                 message: '删除失败'
                            //             });
                            //         }
                            //     },
                            //     complete: (XMLHttpRequest) => {
                            //         requestPretreatment(XMLHttpRequest)
                            //     },
                            // });
                        } else {
                            this.$message({
                                type: 'error',
                                message: '删除失败'
                            });
                        }

                    },
                    complete: (XMLHttpRequest) => {
                        requestPretreatment(XMLHttpRequest)
                    },
                });
            }).catch(() => { });
        },
        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        //查询按钮防止报错
        check() { },
        //重置按钮
        reset() {
            // 这里可以根据你的实际需求修改逻辑
            window.location.reload();
        },
        //过滤树的数据
        filterTreeData(data, searchText) {
            return data.filter((item) => {
                if (item.label.includes(searchText)) {
                    return true;
                }
                if (item.children) {
                    const filteredChildren = this.filterTreeData(
                        item.children,
                        searchText
                    );
                    if (filteredChildren.length > 0) {
                        item.children = filteredChildren;
                        return true;
                    }
                }
                return false;
            });
        },
        // 弹窗全选
        handleAllChecked(val) {
            let a; // 提前声明变量 a
            if (val === false) {
                console.log(this.fields);
                a = this.fields.filter((item) => {
                    return item.COLUMN_KEY == "PRI";
                });
                console.log(a);
            } else {
                a = [...this.fields]; // 当 val 为 true 时，给 a 赋值为 props.fields 的副本
            }
            // 使用 emit 更新 checkedFields
            this.checkedFields = a;
        },
        saveFields() {
            const selectedFields = this.fields.filter((item) => {
                return this.checkedFields.some(
                    (cItem) => cItem && cItem.COLUMN_NAME === item.COLUMN_NAME
                );
            });
            // 更新 columns
            this.columns = selectedFields;
            this.showDialog = false;
        },
        //显示字段弹窗
        handleOpenDialog() {
            this.showDialog = true;
        },
    },
}

const ylUpload = {
    template: `<div :style="{display:drag?'block':'inline-block'}">
<template v-if="!drag">
<div class="preview" v-if="modelValue!=''">
    <el-image @error="handleImageError" :ref="'previewImage' + id" class="el-upload-list__item-thumbnail" style="width: 148px; height: 148px" 
        :src="base64?modelValue:photo + modelValue" fit="contain" :preview-src-list="fileList.map(i => i.url)"></el-image>
    <span class="el-upload-list__item-actions">
        <span @click="handlePictureCardPreview" style="cursor: pointer;">
            <el-icon><ZoomIn /></el-icon>
        </span>
        <span @click="handleRemove" style="cursor: pointer;">
            <el-icon><Delete /></el-icon>
        </span>
    </span>
</div>
<el-upload :disabled="loading" v-else class="upload-demo" :show-file-list="false" :on-change="handleChange"
    list-type="picture-card" action="#" accept="image/*" :auto-upload="false" :file-list="fileList">
    <el-icon>
        <Plus v-if="!loading" /><Loading v-else />
    </el-icon>
</el-upload>
<div v-if="slider" class="el-upload__tip" slot="tip">
    <div v-show="quality < 100">当前图片压缩至{{quality}}%</div>
    <el-slider :min="1" style="width:148px" v-model="quality" :format-tooltip="formatTooltip"></el-slider>
</div>
</template>
<template v-else>
<el-upload class="upload-demo" :accept="accept" :multiple="limit > 1" drag :on-change="handleChange"
    :http-request="customUpload" :file-list="fileList" :on-success="handleSuccess" :show-file-list="showFileList"
    :limit="limit" :on-remove="handleRemove" :on-exceed="handleExceed" :on-preview="handlePreview">
    <el-icon style="font-size: 67px; color: #c0c4cc; margin: 16px 0 16px; line-height: 50px;" >
        <Upload-Filled />
    </el-icon>
    <div class="el-upload__text">将文件拖到此处上传，待点击<em>提交</em>后保存</div>
</el-upload>
</template></div>`,
    props: {
        accept:{
            type:String,
            default: '*/*'
        },
        modelValue: {
            type: String,
            default: ''
        },
        file: {
            type: Array,
            default: function () {
                return []
            }
        },
        base: {
            type: String,
            default: 'https://service.essp.top/mh/Image/'
        },
        base64: {
            type: Boolean,
            default: false
        },
        slider: {
            type: Boolean,
            default: false
        },
        drag: {
            type: Boolean,
            default: false
        },
        limit: {
            type: Number,
            default: 1
        },
        showFileList: {
            type: Boolean,
            default: true
        }
    },
    emits: ['update:modelValue', 'success', 'remove', 'progress', 'clear','preview'],
    data() {
        return {
            photo,
            id: createUniqueString(),
            fileList: [],
            loading: false,
            quality: 100,
        }
    },
    watch: {
        modelValue(name) {
            if (name) {
                this.fileList.push({ name, url: (this.base64 ? '' : this.photo) + name });
            }
        },
        file(val) {
            if (val.length > 0 && this.fileList.length == 0) {
                console.log(val);
                this.fileList = val;
                // val.forEach(item => {
                //     this.fileList.push(item);
                // })
            }
        }
    },
    mounted() {
        this.file.forEach(item => {
            this.fileList.push(item);
        })
    },
    methods: {
        handleImageError() {
            console.log('图片加载失败');
        },
        formatTooltip(val) {
            return '图片压缩比例：' + val + '%';
        },
        async handleChange(file) {
            const { raw } = file;
            const that = this;
            if (this.drag) {
                if (!file.name.includes('（上传中）') && !file.name.includes('（磁盘文件名')) {
                    file.name = file.name + "（上传中）";
                }
            } else {
                new Compressor(raw, {
                    quality: that.quality / 100,
                    success(file) {
                        const validTypes = ['image/jpeg', 'image/png', 'image/webp']
                        if (!validTypes.includes(file.type)) {
                            that.$message.error({ message: '仅支持 JPG / PNG / WEBP 格式的图片', duration: 1500 });
                            return false
                        } else if (file.size / 1024 / 1024 > 8) {
                            that.$message.error({ message: '图片大小不能超过8MB！', duration: 1500 })
                            return false
                        }
                        that.loading = true;
                        that.$emit('progress', that.loading);
                        const formData = new FormData();
                        formData.append('file', file, file.name);
                        let oFileReader = new FileReader();
                        oFileReader.readAsDataURL(file);
                        oFileReader.onload = async function (e) {
                            if (!that.base64) {
                                const result = await that.uploadBinaryFile(file);
                                that.loading = false;
                                that.$emit('progress', that.loading);
                                if (result.status == 'success') {
                                    that.$emit("success", file, result)
                                    that.$emit("update:modelValue", result.fileName);
                                    that.$message.success({ message: '上传成功', duration: 1500 })
                                } else {
                                    that.$message.error({ message: '上传失败', duration: 1500 })
                                }
                            } else {
                                that.$emit("update:modelValue", e.target.result);
                                that.loading = false;
                                that.$emit('progress', that.loading);
                            }
                        }
                    },
                    error(err) {
                        console.log(err.message);
                    },
                });
            }

        },
        handlePictureCardPreview() {
            this.$refs['previewImage' + this.id].showPreview();
        },
        handleClear() {
            this.$emit("clear", this.fileList)
            this.fileList = [];
        },
        handleAdd(fileList) {
            this.fileList = fileList;
        },
        handleRemove(file, fileList = []) {
            this.fileList = fileList;
            this.$emit("remove", file)
            this.$emit("update:modelValue", '');
        },
        handlePreview(file){
            this.$emit("preview", file)
        },
        handleExceed() {
            this.$message({
                type: 'warning',
                message: '最大上传数:' + this.limit
            });
        },
        async customUpload(options) {
            const { file } = options;
            this.loading = true;
            this.$emit('progress', this.loading);
            const result = await this.uploadBinaryFile(file);
            if (result.status == 'success') {
                this.fileList.push(file);
                this.$emit("success", file, result)
                this.$emit("update:modelValue", result.fileName);
                options.onSuccess(result)
                this.$message.success({ message: '上传成功', duration: 1500 })
            } else {
                this.$message.error({ message: '上传失败', duration: 1500 });
            }
            this.loading = false;
            this.$emit('progress', this.loading);
        },
        handleSuccess(result, file, fileList) {
            if (result) {
                fileList.filter(i => i.uid == file.uid).forEach(item => {
                    item.name = item.name.replace('（上传中）', '（磁盘文件名:' + result.fileName + '）');
                    item.Attachment_URL = result.fileName;
                })
            }
        },
        async uploadBinaryFile(file) {
            try {
                const response = await fetch(
                    mh + "/generalBusiness/upload-stream",
                    {
                        method: "POST",
                        headers: {
                            "Content-Type": "application/octet-stream",
                            "X-File-Name": encodeURIComponent(file.name),
                            "X-File-Size": file.size,
                            "X-File-Type": file.type,
                            "AccessToken": getCookie("token"),
                        },
                        body: file,
                    }
                );
                try {
                    const result = await response.json();
                    return result;
                } catch (error) {
                    removeCookie("token");
                    removeCookie("user");
                    sessionStorage.setItem("REDIRECT", "登录已过期，请重新登录！");
                    window.parent.document.location.href = absolutepath() + 'index.html';
                }

            } catch (error) {
                throw error;
            }
        }
    }
}


const ylTextEditor = {
    template: `<div id="editor—wrapper">
        <div :id="'toolbar-container' + str"><!-- 工具栏 --></div>
        <div :id="'editor-container' + str"><!-- 编辑器 --></div>
    </div>`,
    props: {
        modelValue: {
            type: String,
            default: '',
        },
        placeholder: {
            type: String,
            default: '请填写富文本内容...'
        },
        max: {
            type: Number,
            default: 0,
        },
        type: {
            type: String,
            default: 'default'
        },
        disabled: {
            type: Boolean,
            default: false,
        }
    },
    emits: ['update:modelValue'],
    data() {
        return {
            str:createUniqueString(),
            editor: null,//核心
            // html: this.value,//文本内容
        }
    },
    mounted() {
        this.init()
        if (this.modelValue !='' && this.editor.getHtml() != this.modelValue) {
            this.editor.setHtml(this.modelValue);
        }
        if (this.editor.isDisabled() && !this.disabled) {
            this.editor.enable();
        } else if (!this.editor.isDisabled() && this.disabled) {
            this.editor.disable();
        }
    },
    watch: {
        // html(newVal) {//组件双向绑定
        //     this.$emit('input', newVal);
        // },
        modelValue(newVal) {//更新文本内容
            if (this.editor.getHtml() != newVal) {
                this.editor.setHtml(newVal);
            }
        },
        disabled(disabled) {//动态禁用状态
            if (this.editor.isDisabled() && !disabled) {
                this.editor.enable();
            } else if (!this.editor.isDisabled() && disabled) {
                this.editor.disable();
            }
        }
    },
    computed: {
        maxLength() {//最大文字限制，默认0为无限制
            return this.max == 0 ? {} : { maxLength: this.max };
        },
        mode() {//是否开启简洁模式
            return this.type == 'default' || this.type == 'simple' ? this.type : 'default';
        }
    },
    methods: {
        init() {//初始化
            const that = this;
            const { createEditor, createToolbar } = window.wangEditor
            const editorConfig = {
                placeholder: this.placeholder,
                ...this.maxLength,
                readOnly: this.disabled,
                MENU_CONF: {
                    uploadImage: {
                        async customUpload(file, insertFn) {
                            new Compressor(file, {
                                quality: 1,
                                success(file) {
                                    const formData = new FormData();
                                    formData.append('file', file, file.name);
                                    let oFileReader = new FileReader();
                                    oFileReader.readAsDataURL(file);
                                    oFileReader.onload = function (e) {
                                        $.ajax({
                                            headers: requestHeaders(),
                                            url: `${mh}/generalBusiness/generalSaveFilesAsImage`,
                                            type: 'POST',
                                            data: JSON.stringify({
                                                Data: e.target.result,
                                                DataLength: file.size,
                                                FileName: file.name
                                            }),
                                            success: function (Result) {
                                                if (Result.Status == "success") {
                                                    insertFn(photo + Result.FileName, "", "");
                                                } else {
                                                    that.$message.error('上传失败')
                                                }
                                            },
                                            complete: (XMLHttpRequest) => {
                                                requestPretreatment(XMLHttpRequest)
                                            },
                                            dataType: "json"
                                        });
                                    }
                                },
                                error(err) {
                                    console.log(err.message);
                                },
                            });
                        }
                    },
                    uploadVideo: {
                        async customUpload(file, insertFn) {
                            const res = await that.uploadBinaryFile(file);
                            if (res.status == "success") {
                                insertFn(photo + res.fileName, "");
                            } else {
                                that.$message.error('上传失败')
                            }
                        }
                    }
                },
                onChange: (editor) => {
                    this.$emit("update:modelValue", editor.getHtml().replace(/(>[^<]*?)'([^<]*?<)/g, '$1’$2'));
                },
                onDestroyed(editor) {
                    editor.destroy();
                }
            }
            const editor = createEditor({
                selector: '#editor-container'+this.str,
                html: '<p><br></p>',
                config: editorConfig,
                mode: this.mode,
            })
            const toolbarConfig = {}
            const toolbar = createToolbar({
                editor: editor,
                selector: '#toolbar-container'+this.str,
                config: toolbarConfig,
                mode: this.mode,
            })
            this.editor = Object.seal(editor);
        },
        async uploadBinaryFile(file) {
            try {
                const response = await fetch(
                    mh + "/generalBusiness/upload-stream",
                    {
                        method: "POST",
                        headers: {
                            "Content-Type": "application/octet-stream",
                            "X-File-Name": encodeURIComponent(file.name),
                            "X-File-Size": file.size,
                            "X-File-Type": file.type,
                            "AccessToken": getCookie("token"),
                        },
                        body: file,
                    }
                );
                const result = await response.json();
                return result;
            } catch (error) {
                throw error;
            }
        }
    }
};

const ylMonthlyCalendar = {
    template: `<div id="Calendar" style="color: #383838;">
    <div style="margin: 20px 0; display: flex; justify-content: center;align-items: center;font-size: 24px;font-weight: 700;">
        <el-icon style="cursor: pointer;" @click="handleYear('-')"><arrow-left /></el-icon>
        <span style="padding: 10px 20px;">{{Year}}年</span>
        <el-icon style="cursor: pointer;" @click="handleYear('+')"><arrow-right /></el-icon>
    </div>
    <div style="border: 1px solid rgb(207, 207, 207);min-width: 610px;">
        <el-row>
            <el-col :span="6" v-for="i in 12" :key="i">
                <div style="display: flex;flex-direction: column; border: 1px solid rgb(207, 207, 207);height: 120px;min-width: 150px;">
                    <div style="flex-shrink: 0; margin: 10px 15px 0;font-size: 24px; font-weight: 700;">{{i}}月</div>
                    <div style="margin-top:-15px; height: 100%;width: 100%;display: flex;font-size: 18px;justify-content: center;align-items: center;flex-direction: column;">
                        <span>{{payFees(Year,i)!=' '?'交纳情况':''}}</span>
                        <span>{{payFees(Year,i)}}&nbsp;</span>
                        <span style="font-size: 12px;">{{payFeesHandOver(Year,i)!=' '?'党组上缴':''}}&nbsp;</span>
                    </div>
                </div>
            </el-col>
        </el-row>
    </div></div>`,
    data() {
        return {
            Year: new Date().getFullYear(),
            data: [],
            data1: [],
        }
    },
    props: {
        value: {
            type: String,
            default: "",
        },
    },
    mounted() {
        document.getElementById("Calendar").addEventListener('selectstart', (e) => {
            e.preventDefault();
        });
        this.getData();
    },
    computed: {
        payFees() {
            return function (Year, Month) {
                let obj = this.data.filter(i => i.year == Year && i.month == Month)[0];
                return obj ? (obj.fee_cnt + '/' + obj.total_cnt) : ' '
            }
        },
        payFeesHandOver() {
            return function (Year, Month) {
                let obj = this.data1.filter(i => i.month == Month)[0];
                return obj ? (obj.cnt) : ' '
            }
        }
    },
    watch: {
        value(val) {
            this.getData();
        }
    },
    methods: {
        handleYear(val) {
            val == '+' ? this.Year++ : this.Year--;
            this.getData();
        },
        getData() {
            if (this.value) {
                $.ajax({
                    headers: requestHeaders(),
                    url: `${mh}/generalBusiness/generalQueryBySQLSerialNumber`,
                    method: "post",
                    data: {
                        SQLSerialNumber: "f_party_fees_month",
                        Condition: window.btoa(unescape(encodeURIComponent(this.Year + ",%" + this.value + "%,%" + this.value + "%"))),
                    },
                    success: (data) => {
                        this.data = data;
                    },
                    complete: (XMLHttpRequest) => {
                        requestPretreatment(XMLHttpRequest)
                    },
                });
                $.ajax({
                    headers: requestHeaders(),
                    url: `${mh}/generalBusiness/generalQueryBySQLSerialNumber`,
                    method: "post",
                    data: {
                        SQLSerialNumber: "f_party_fees_hand_over_month",
                        Condition: window.btoa(unescape(encodeURIComponent(this.value + "," + this.Year))),
                    },
                    success: (data) => {
                        this.data1 = data;
                    },
                    complete: (XMLHttpRequest) => {
                        requestPretreatment(XMLHttpRequest)
                    },
                });
            }
        }
    },
}

const ylHouseGrid = {
    template: `<div style="width: 700px;">
    <div style="display: flex;flex-wrap: wrap;padding: 10px 0 0 10px;">
        <div @click="handleUnit(i)" v-for="i in isNaN(parseInt(data.Unit_Quantity))?0:parseInt(data.Unit_Quantity)" :key="i" style="margin: 0 10px 10px 0; width: 100px; height: 100px;background-color: #D3DCE6; 
            display: flex; justify-content: space-around; align-items: center;font-size: 24px;cursor: pointer;"
            :style="{backgroundColor: selected==i?'#F56C6C':'#D3DCE6', color: selected==i?'#fff':'#000'}">
            <span>{{numberToChinese(i)}}</span><span>{{data.Self_Built_Houses=='1'?'栋':'单'}}</span><span>{{data.Self_Built_Houses=='1'?'楼':'元'}}</span>
        </div>
    </div>
    <div style="display: flex;padding: 10px 0 0 10px;">
        <div style="display: flex; flex-direction: column;justify-content: space-around; align-items: center; flex-shrink: 0;
            margin: 0 10px 10px 0; width: 50px; height: 300px;background-color: #D3DCE6;font-size: 24px;">
            <span>{{numberToChinese(selected)}}</span><span>{{data.Self_Built_Houses=='1'?'栋':'单'}}</span><span>{{data.Self_Built_Houses=='1'?'楼':'元'}}</span>
        </div>
        <div v-if="data.Self_Built_Houses=='1'&&layer[selected]" style="height: 300px;width: 100%; overflow-y: auto;">
            <div v-for="x in isNaN(parseInt(layer[selected].Layer_Quantity))?0:parseInt(layer[selected].Layer_Quantity)" :key="x" >
                <span style="font-size: 24px;">{{x}} 层</span>
                <div style="display: flex; flex-wrap: wrap;margin-top: 10px;" >
                    <div @click="handleRoom(selected,x,i)" v-for="i in isNaN(parseInt(layer[selected].Room[x].Room_Quantity))?0:parseInt(layer[selected].Room[x].Room_Quantity)" :key="i" style="margin: 0 10px 10px 0; width: 50px; height: 50px;background-color: #D3DCE6;line-height: 50px; text-align: center; cursor: pointer;"
                        :style="{backgroundColor:liveStatus(selected,x,i)?'#F56C6C':'#D3DCE6',color:liveStatus(selected,x,i)?'#fff':'#000'}">
                        {{i}}
                    </div>
                </div>
            </div>
        </div>
        <div v-else style="height: 300px;width: 100%; overflow-y: auto;">
            <div v-for="x in isNaN(parseInt(data.Layer_Quantity))?0:parseInt(data.Layer_Quantity)" :key="x" >
                <span style="font-size: 24px;">{{x}} 层</span>
                <div style="display: flex; flex-wrap: wrap;margin-top: 10px;">
                    <div @click="handleRoom(selected,x,i)" v-for="i in isNaN(parseInt(data.Room_Quantity))?0:parseInt(data.Room_Quantity)" :key="i" style="margin: 0 10px 10px 0; width: 50px; height: 50px;background-color: #D3DCE6;line-height: 50px; text-align: center; cursor: pointer;"
                        :style="{backgroundColor:liveStatus(selected,x,i)?'#F56C6C':'#D3DCE6',color:liveStatus(selected,x,i)?'#fff':'#000'}">
                        {{i}}
                    </div>
                </div>
            </div>
        </div>
    </div></div>`,
    data() {
        return {
            selected: 1,
            house_room: [],
        }
    },
    props: {
        data: {
            type: Object,
            default: function () {
                return {};
            },
        },
        layer: {
            type: Object,
            default: function () {
                return {};
            },
        }
    },
    emits: ['node-click'],
    mounted() {
        this.getHouseRoom(this.data.Blue_Plate_SerialNumber);
    },
    computed: {
        numberToChinese() {
            return function (num) {
                if (isNaN(num) || num < 0 || num > 999999999999) {
                    return '无效数字';
                }
                const chineseNums = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九'];
                const chineseUnits = ['', '十', '百', '千', '万', '十', '百', '千', '亿', '十', '百', '千'];

                let str = '';
                let unitPos = 0;
                let needZero = false;

                if (num === 0) {
                    return chineseNums[0];
                }

                while (num > 0) {
                    const digit = num % 10;
                    if (digit === 0) {
                        if (!needZero && unitPos % 4 !== 0) {
                            needZero = true;
                        }
                    } else {
                        if (needZero) {
                            str = chineseNums[0] + str;
                            needZero = false;
                        }
                        str = chineseNums[digit] + chineseUnits[unitPos] + str;
                    }
                    num = Math.floor(num / 10);
                    unitPos++;
                }

                // 处理"一十"开头的特殊情况，通常简化为"十"
                if (str.startsWith('一十')) {
                    str = str.substring(1);
                }

                return str;
            }
        },
        liveStatus() {
            return function (Unit_Number, Layer_Number, Room_Number) {
                return this.house_room.some(i => i.Unit_Number == Unit_Number && i.Layer_Number == Layer_Number && i.Room_Number == Room_Number && i.Live_Status == '1')
            }
        }
    },
    watch: {
        'data.Blue_Plate_SerialNumber'(val) {
            this.getHouseRoom(val);
        }
    },
    methods: {
        getHouseRoom(val) {
            $.ajax({
                headers: requestHeaders(),
                url: `${mh}/generalBusiness/generalQueryByTableName`,
                type: "POST",
                data: {
                    Data: 'blue_plate_house_room',
                    Condition: "Row_Status='0' AND Blue_Plate_SerialNumber = '" + val + "'",
                },
                success: (data) => {
                    this.house_room = data; // 直接使用 this
                },
                complete: (XMLHttpRequest) => {
                    requestPretreatment(XMLHttpRequest)
                },
                dataType: "json",
            });
        },
        handleUnit(i) {
            this.selected = i;
        },
        handleRoom(Unit_Number, Layer_Number, Room_Number) {
            let obj = this.house_room.filter(i => i.Unit_Number == Unit_Number && i.Layer_Number == Layer_Number && i.Room_Number == Room_Number)[0]
            this.$emit('node-click', obj)
        }
    }
}

const ylOnlinePreview = {
    template: `<el-dialog v-model="showDialog" :destroy-on-close="true" :close-on-click-modal="false" width="800"
    class="custom-dialog" style="position: relative;">
    <template #header>
        <div class="dialog-header">
            <span>在线预览</span>
        </div>
    </template>
    <div class="dialog-content" style="max-height: 60vh;overflow-y: auto;">
        <template v-if="isType == 'xlsx'">
            <el-tabs v-if="!classified" type="border-card">
                <el-tab-pane v-for="(obj,key) in xlsxData" :key="key" :label="key">
                    <el-table :data="obj.data" border style="width: 100%" tooltip-effect="dark">
                        <el-table-column show-overflow-tooltip min-width="180" v-for="(col, index) in obj.columns" :key="index" :prop="col" :label="col" />
                    </el-table>
                </el-tab-pane>
            </el-tabs>
            <iframe v-else-if="classified && pdfUrl" :src="eBook + pdfUrl" style="width:100%;height:59vh;border:none;" frameborder="false"></iframe>
        </template>
        <template v-else-if="isType == 'pdf'">
            <template v-if="!classified">
                <div :id="'pdfViewer'+timestamp" :style="'transform: scale(' + (scale / 100) + ') translate('+ (scale - 100) +'%, 0);transformOrigin: top left;'">
                    <div :id="num+'-pdfViewer'+timestamp" v-for="num in pdfData.numPages" :key="num"></div>
                </div>
                <el-input-number v-if="pdfData.numPages" style="position: absolute;right: 50px;top:50px" v-model="scale" :min="1"></el-input-number>
            </template>
            <iframe v-else :src="fileUrl" style="width:100%;height:59vh;border:none;" frameborder="false"></iframe>
        </template>
        <template v-else-if="isType == 'image'">
            <el-image style="width: 100%" :src="fileUrl" fit="contain"></el-image>
        </template>
        <template v-else-if="isType == 'video'">
            <video style="width: 100%;" :src="fileUrl" controls autoplay loop muted></video>
        </template>
        <template v-else-if="isType == 'word'">
            <iframe v-if="!classified" :src="'https://view.officeapps.live.com/op/embed.aspx?src='+fileUrl" style="width:100%;height:59vh;border:none;" frameborder="false"></iframe>
            <iframe v-else-if="classified && pdfUrl" :src="eBook + pdfUrl" style="width:100%;height:59vh;border:none;" frameborder="false"></iframe>
        </template>
        <template v-else-if="isType == 'audio'">
            <audio controls :src="fileUrl" style="width:100%;"></audio>
        </template>
        <template v-else>
            <h1>暂无可查看内容</h1>
        </template>
    </div>
    <template #footer>
        <div class="dialog-footer">
            <el-button @click="showDialog = false" class="cancel-btn">取消</el-button>
        </div>
    </template>
</el-dialog>`,
    props: {
        modelValue: {
            type: Boolean,
            default: false,
        },
        fileUrl: {
            type: String,
            default: ''
        },
        classified: {
            type: Boolean,
            default: true
        }
    },
    data() {
        return {
            eBook,
            timestamp: '',
            showDialog: this.modelValue,
            scale: 100,
            xlsxData: {},
            pdfData: {
                numPages: 0,
            },
            pdfUrl: '',
        }
    },
    emits: ['update:modelValue'],
    watch: {
        modelValue(val) {
            this.showDialog = val;
            if (val) {
                this.timestamp = +new Date();
                this.getData();
            }
        },
        showDialog(val) {
            this.$emit('update:modelValue', val);
        }
    },
    computed: {
        isType() {
            let fileUrl = this.fileUrl;
            const xlsx = ['xlsx', 'xls', 'csv'], word = ['docx', 'doc'], pdf = ['pdf'], video = ['mp4'], image = ['png', 'jpg', 'jpeg'], audio = ['mp3','m4a','wma','ogg','aac'];
            const lastDotIndex = fileUrl.lastIndexOf('.');
            if (lastDotIndex !== -1) {
                const extension = fileUrl.slice(lastDotIndex + 1);
                if (xlsx.some(i => i == extension)) {//表格
                    return 'xlsx'
                } else if (word.some(i => i == extension)) {
                    return 'word'
                } else if (pdf.some(i => i == extension)) {
                    return 'pdf'
                } else if (video.some(i => i == extension)) {
                    return 'video'
                } else if (image.some(i => i == extension)) {
                    return 'image'
                } else if (audio.some(i => i == extension)) {
                    return 'audio'
                }
            }
            return 'error'
        }
    },
    methods: {
        async convertExeclToPdf(file) {
            try {
                const response = await fetch(
                    `${mh}/officeOperation/convertExeclToPdf`,
                    {
                        method: "POST",
                        headers: {
                            "Content-Type": "application/octet-stream",
                            "X-File-Name": encodeURIComponent(file.name),
                            "X-File-Size": file.size,
                            "X-File-Type": file.type,
                            "AccessToken": getCookie("token"),
                        },
                        body: file,
                    }
                );
                const result = await response.json();
                return result;
            } catch (error) {
                throw error;
            }
        },
        async convertWordToPdf(file) {
            try {
                const response = await fetch(
                    `${mh}/officeOperation/convertWordToPdf`,
                    {
                        method: "POST",
                        headers: {
                            "Content-Type": "application/octet-stream",
                            "X-File-Name": encodeURIComponent(file.name),
                            "X-File-Size": file.size,
                            "X-File-Type": file.type,
                            "AccessToken": getCookie("token"),
                        },
                        body: file,
                    }
                );
                const result = await response.json();
                return result;
            } catch (error) {
                throw error;
            }
        },
        async getData() {
            const that = this;
            if ((this.isType == 'xlsx' || this.isType == 'word') && this.classified) { //涉密文件时,需自定义配置
                let Attachment_URL = this.fileUrl.replace(/.*\//, '');
                $.ajax({
                    headers: requestHeaders(),
                    url: `${mh}/generalBusiness/generalQueryByTableName`,
                    type: "POST",
                    data: {
                        Data: 'convert_pdf_log',
                        Condition: "Row_Status='0' AND Attachment_URL = '" + Attachment_URL + "'",
                    },
                    success: (data) => {
                        if (data.length == 1) {
                            this.pdfUrl = data[0].Pdf_Attachment_URL;
                        } else {
                            fetch(this.fileUrl).then(response => {
                                if (!response.ok) {
                                    throw new Error(`HTTP error! status: ${response.status}`);
                                }
                                return response.blob();
                            }).then(async (blob) => {
                                blob.name = Attachment_URL;
                                let result;
                                if (this.isType == 'xlsx') {
                                    result = await this.convertExeclToPdf(blob);
                                } else if (this.isType == 'word') {
                                    result = await this.convertWordToPdf(blob);
                                }
                                if (result.status == 'success') {
                                    lJSONObject_DataSet = {
                                        Add: {
                                            convert_pdf_log: [{
                                                Attachment_URL,
                                                Pdf_Attachment_URL: result.fileName,
                                                Pdf_Temp_Path: result.tempPath
                                            }]
                                        }
                                    };
                                    let ls_URL = window.location.href;
                                    let Operation_Path = ls_URL.substring(
                                        ls_URL.lastIndexOf("view"),
                                        ls_URL.length
                                    );
                                    let Operation_Main = JSON.stringify(deepClone(lJSONObject_DataSet));
                                    lJSONObject_DataSet['Add']['base_operation_log'] = [{
                                        Operation_Type: '0',
                                        Operation_Path,
                                        Operation_Main,
                                        Operation_Interface: "generalSaveByRequestBody",
                                        Operation_IP: getIpAddress()
                                    }]
                                    submitSave(lJSONObject_DataSet, (res) => {
                                        if (res.Status == 'success') {
                                            this.pdfUrl = result.fileName;
                                        }
                                    })
                                    // $.ajax({
                                    //     headers: requestHeaders("JSON"),
                                    //     url: `${mh}/generalBusiness/generalSaveByRequestBody`,
                                    //     method: "post",
                                    //     data: JSON.stringify({ Data: lJSONObject_DataSet }),
                                    //     success: (res) => {
                                    //         if (res.Status == 'success') {
                                    //             this.pdfUrl = result.fileName;
                                    //         }
                                    //     },
                                    //     complete: (XMLHttpRequest) => {
                                    //         requestPretreatment(XMLHttpRequest)
                                    //     }
                                    // });
                                }
                            }).catch(error => {
                                console.error('Error loading the file:', error);
                            });
                        }
                    },
                    complete: (XMLHttpRequest) => {
                        requestPretreatment(XMLHttpRequest)
                    },
                    dataType: "json",
                });
            } else if (this.isType == 'xlsx') {//表格
                fetch(this.fileUrl).then(response => {
                    if (!response.ok) {
                        throw new Error(`HTTP error! status: ${response.status}`);
                    }
                    return response.arrayBuffer();
                }).then(data => {
                    const workbook = XLSX.read(data, { type: 'array' });
                    workbook.SheetNames.forEach(item => {
                        const worksheet = workbook.Sheets[item];
                        const jsonData = XLSX.utils.sheet_to_json(worksheet);
                        if (jsonData.length > 0) {
                            this.columns = Object.keys(jsonData[0]);
                            this.xlsxData[item] = {
                                columns: Object.keys(jsonData[0]),
                                data: jsonData
                            }
                        }
                    })
                }).catch(error => {
                    console.error('Error loading the file:', error);
                });
            } else if (this.isType == 'pdf' && !this.classified) {
                pdfjsLib.GlobalWorkerOptions.workerSrc = absolutepath() + 'utils/pdf.worker.min.js';
                pdfjsLib.getDocument(that.fileUrl).promise.then(function (pdf) {
                    that.pdfData.numPages = pdf.numPages;
                    for (let i = 1; i <= pdf.numPages; i++) {
                        pdf.getPage(i).then(function (page) {
                            const scale = 1.25;
                            const viewport = page.getViewport({ scale: scale });
                            const canvas = document.createElement('canvas');
                            const context = canvas.getContext('2d');
                            canvas.height = viewport.height;
                            canvas.width = viewport.width;
                            document.getElementById(i + '-pdfViewer' + that.timestamp).appendChild(canvas);
                            const renderContext = {
                                canvasContext: context,
                                viewport: viewport
                            };
                            page.render(renderContext).promise.then(function () {
                                console.log('Page rendered');
                            });
                        });
                    }

                }).catch(function (error) {
                    console.error('Error loading PDF:', error);
                });
            }
        }
    }
};

const ylCascader = {
    template: `<el-cascader filterable @change="changeValue" class="borderless-input" v-model="data" :placeholder="placeholder" :options="options" :props="props" clearable style="width: 100%"></el-cascader>`,
    props: {
        modelValue: {
            type: String,
            default: ''
        },
        placeholder: {
            type: String,
            default: '请选择'
        },
        props: {
            type: Object,
            default: function () {
                return {}
            }
        },
        options: {
            type: Array,
            default: function () {
                return []
            }
        },
        update: {
            type: Boolean,
            default: true
        }
    },
    emits: ['update:modelValue', 'change'],
    data() {
        return {
            data: []
        }
    },
    watch: {
        modelValue(val) {
            let value = this.props.value ? this.props.value : 'value';
            let children = this.props.children ? this.props.children : 'children';
            this.data = this.configValue(this.options, { value, children }, val);
        },
        options(val) {
            let value = this.props.value ? this.props.value : 'value';
            let children = this.props.children ? this.props.children : 'children';
            this.data = this.configValue(val, { value, children }, this.modelValue);
        },
        update() {//强制更新
            let value = this.props.value ? this.props.value : 'value';
            let children = this.props.children ? this.props.children : 'children';
            this.data = this.configValue(this.options, { value, children }, this.modelValue);
        }
    },
    mounted() {
        let value = this.props.value ? this.props.value : 'value';
        let children = this.props.children ? this.props.children : 'children';
        this.data = this.configValue(this.options, { value, children }, this.modelValue);
    },
    methods: {
        configValue(options, props, val) {
            const { value, children } = props;
            for (let i = 0; i < options.length; i++) {
                const item = options[i];
                if (item[value] == val) {
                    return [item[value]];
                } else if (item[children] && item[children].length > 0) {
                    let arr = this.configValue(item[children], props, val);
                    if (arr) {
                        return [item[value], ...arr];
                    }
                }
            }
        },
        changeValue(val) {
            if (val && val.length > 0) {
                this.$emit('update:modelValue', val[val.length - 1])
            } else {
                this.$emit('update:modelValue', '')
            }
            this.$emit('change', val);
        }
    }
}

const ylSelect = {
    template: `<el-popover :disabled="disabled" :ref="refName" placement="bottom" v-model:visible="visible" trigger="click" :width="'calc('+ width +' - 24px)'" @show="onShow" @hide="onHide">
    <template #reference>
        <div v-if="!props.multiple" style="position: relative;width: 100%;" @mouseenter="handleMouseEnter" @mouseleave="handleMouseLeave">
            <el-input @input="inputValue" class="borderless-input" :disabled="disabled" :placeholder="showValue?showValue:placeholder" v-model="value">
                <template #suffix>
                    <el-icon v-if="!isMove" :style="{cursor: 'pointer',transform:'rotate('+ (visible?'180':'0') + 'deg)', transition:'0.3s'}">
                        <Arrow-Down />
                    </el-icon>
                    <el-icon @click.stop="handleClean" v-else :style="{cursor: 'pointer'}">
                        <Circle-Close />
                    </el-icon>
                </template>
            </el-input>
            <div v-show="!filterable" style="width:100%;height:100%; position: absolute; top: 0;left: 0;cursor:pointer"></div>
        </div>
        <div v-else class="el-select" style="position: relative;" @mouseenter="handleMouseEnter" @mouseleave="handleMouseLeave">
            <div :class="{'is-focused':visible,'is-hovering':ishover,'is-disabled':disabled}" class="el-select__wrapper is-filterable el-tooltip__trigger el-tooltip__trigger">
                <div class="el-select__selection is-near">
                    <div class="el-select__selected-item">
                        <span class="el-tag is-closable el-tag--info el-tag--default el-tag--light" :style="{marginLeft:index?'5px':'0'}" style="max-width: 1141px;" v-for="(item,index) in modelValue" :key="index">
                            <span class="el-tag__content">
                                <span class="el-select__tags-text">{{tagValue(item)}}</span>
                            </span>
                            <el-icon :style="{marginLeft:'5px'}" @click.stop="handleRemove(item)">
                                <Close />
                            </el-icon>
                        </span>
                    </div>
                    <div class="el-select__selected-item el-select__input-wrapper">
                        <input @input="inputValue" :id="refName" type="text" class="el-select__input" v-model="value1" style="min-width: 11px;">
                    </div>
                    <div v-show="modelValue.length == 0" style="font-size: 14px; margin-left: 8px;" class="el-select__selected-item el-select__placeholder is-transparent"><span>{{placeholder}}</span></div>
                </div>
                <el-icon :style="{cursor: 'pointer',transform:'rotate('+ (visible?'180':'0') + 'deg)', transition:'0.3s', color:'#a8abb2' }">
                    <Arrow-Down />
                </el-icon>
            </div>
        </div>
    </template>
    <el-table :ref="refName + '_tabel'" :row-key="row=>row[props.value ? props.value : 'value']" :row-style="tableRowStyle" :data="tableData" border style="width:calc(100% - 10px)" max-height="276px" 
        @row-click="handleRowClick" @select="(selection, row)=>{ this.handleSelect(row) }" @select-all="handleSelectAll">
        <el-table-column v-if="props.multiple" reserve-selection align="center" type="selection" width="40"></el-table-column>
        <el-table-column align="center" type="index" label="#" width="50"></el-table-column>
        <slot></slot>
    </el-table></el-popover>`,
    data() {
        return {
            refName: 'ylSelect_' + this.createUniqueString(),
            visible: false,
            isMove: false,
            ishover: false,
            value: '',
            value1: '',
            showValue: '',
            tableData: [],
        }
    },
    props: {
        modelValue: {
            type: [String, Number, Array],
            default: '',
        },
        placeholder: {
            type: String,
            default: '请选择'
        },
        disabled: {
            type: Boolean,
            default: false
        },
        clearable: {
            type: Boolean,
            default: false
        },
        filterable: {
            type: Boolean,
            default: false
        },
        props: {
            type: Object,
            default: function () {
                return {}
            }
        },
        options: {
            type: Array,
            default: function () {
                return []
            }
        },
        width: {
            type: String,
            default: '100%'
        }
    },
    watch: {
        modelValue(val) {
            this.init(val);
        },
        options(arr) {
            this.tableData = arr;
            let value = this.props.value ? this.props.value : 'value';
            let label = this.props.label ? this.props.label : 'label';
            let multiple = this.props.multiple ? this.props.multiple : false;
            if (multiple) {
                this.$nextTick(() => {
                    this.modelValue.forEach(val => {
                        this.tableData.filter(i => i[value] == val).forEach(item => {
                            this.$refs[this.refName + '_tabel'].toggleRowSelection(item, true);
                        })
                    });
                })
            } else {
                let obj = arr.filter(i => i[value] == this.modelValue)[0];
                this.value = obj ? obj[label] : this.modelValue;
            }
        }
    },
    computed: {
        tagValue() {
            return function (val) {
                let value = this.props.value ? this.props.value : 'value';
                let label = this.props.label ? this.props.label : 'label';
                let obj = this.options.filter(i => i[value] == val)[0];
                return obj ? obj[label] : val;
            }
        }
    },
    mounted() {
        this.init(this.modelValue);
    },
    emits: ['update:modelValue', 'change'],
    methods: {
        init(val) {
            let value = this.props.value ? this.props.value : 'value';
            let label = this.props.label ? this.props.label : 'label';
            let multiple = this.props.multiple ? this.props.multiple : false;
            if (multiple && !Array.isArray(this.modelValue)) {
                this.$emit('update:modelValue', []);
            }
            let obj = this.options.filter(i => i[value] == val)[0];
            this.value = obj ? obj[label] : val;
            this.tableData = this.options;
            if (multiple) {
                this.$nextTick(() => {
                    this.modelValue.forEach(val => {
                        this.tableData.filter(i => i[value] == val).forEach(item => {
                            this.$refs[this.refName + '_tabel'].toggleRowSelection(item, true);
                        })
                    });
                })
            }
        },
        inputValue(val) {
            let multiple = this.props.multiple ? this.props.multiple : false;
            if (multiple) {
                let label = this.props.label ? this.props.label : 'label';
                this.tableData = this.tableData.filter(row => row[label].includes(this.value1))
            } else {
                let label = this.props.label ? this.props.label : 'label';
                this.tableData = this.tableData.filter(row => row[label].includes(val))
            }

        },
        createUniqueString() {
            const timestamp = +new Date() + "";
            const randomNum = parseInt((1 + Math.random()) * 65536) + "";
            return (+(randomNum + timestamp)).toString(32);
        },
        handleRowClick(row) {
            let value = this.props.value ? this.props.value : 'value';
            let label = this.props.label ? this.props.label : 'label';
            let multiple = this.props.multiple ? this.props.multiple : false;
            if (multiple) {
                let modelValue = this.modelValue;
                if (!modelValue.some(val => val == row[value])) {
                    modelValue.push(row[value]);
                    this.tableData.filter(i => i[value] == row[value]).forEach(item => {
                        this.$refs[this.refName + '_tabel'].toggleRowSelection(item, true);
                    })
                } else {
                    modelValue = modelValue.filter(val => val != row[value]);
                    this.tableData.filter(i => i[value] == row[value]).forEach(item => {
                        this.$refs[this.refName + '_tabel'].toggleRowSelection(item, false);
                    })
                }
                this.$emit('update:modelValue', modelValue);
                this.$emit('change', modelValue);
            } else {
                this.value = row[label];
                this.showValue = row[label];
                this.$emit('update:modelValue', row[value]);
                this.$emit('change', row[value]);
                this.visible = false;
            }
        },
        handleSelect(row) {
            let value = this.props.value ? this.props.value : 'value';
            let modelValue = this.modelValue;
            if (!modelValue.some(val => val == row[value])) {
                modelValue.push(row[value]);
                this.tableData.filter(i => i[value] == row[value]).forEach(item => {
                    this.$refs[this.refName + '_tabel'].toggleRowSelection(item, true);
                });
            } else {
                modelValue = modelValue.filter(val => val != row[value]);
                this.tableData.filter(i => i[value] == row[value]).forEach(item => {
                    this.$refs[this.refName + '_tabel'].toggleRowSelection(item, false);
                });
            }
            this.$emit('update:modelValue', modelValue);
            this.$emit('change', modelValue);
        },
        handleSelectAll(selection) {
            let value = this.props.value ? this.props.value : 'value';
            let modelValue = this.modelValue;
            if (selection.length == 0) {
                modelValue = [];
            } else {
                selection.forEach(row => {
                    if (!modelValue.some(val => val == row[value])) {
                        modelValue.push(row[value]);
                    }
                })
            }
            this.$emit('update:modelValue', modelValue);
            this.$emit('change', modelValue);
        },
        onShow() {
            this.showValue = this.value;
            this.value = '';
        },
        onHide() {
            this.value = this.showValue;
            this.tableData = this.options;
            this.showValue = '';
            this.value1 = '';
        },
        handleMouseEnter() {
            this.ishover = true;
            if (this.clearable && (this.value || this.showValue)) {
                this.isMove = true;
            }
        },
        handleMouseLeave() {
            this.ishover = false;
            if (this.clearable && (this.value || this.showValue)) {
                this.isMove = false;
            }
        },
        handleClean() {
            this.value = '';
            this.showValue = '';
            this.$emit('update:modelValue', '');
            this.$emit('change', '');
            this.isMove = false;
        },
        tableRowStyle({ row }) {
            let value = this.props.value ? this.props.value : 'value';
            let obj = {};
            let multiple = this.props.multiple ? this.props.multiple : false;
            if (multiple) {
                if (this.modelValue.some(val => val == row[value])) {
                    obj = { backgroundColor: 'rgb(235.9, 245.3, 255)', fontWeight: 'bold', color: '#409EFF' }
                }
            } else {
                if (row[value] == this.modelValue) {
                    obj = { backgroundColor: 'rgb(235.9, 245.3, 255)', fontWeight: 'bold', color: '#409EFF' }
                }
            }
            return obj
        },
        handleRemove(val) {
            let modelValue = this.modelValue.filter(str => str != val);
            let value = this.props.value ? this.props.value : 'value';
            this.tableData.filter(i => i[value] == val).forEach(item => {
                this.$refs[this.refName + '_tabel'].toggleRowSelection(item, false);
            });
            this.$emit('update:modelValue', modelValue);
            this.$emit('change', modelValue);
        }
    },
};


/**
 * 手机样式模拟
 */
const mobile = {
    template: `<div :style="showMobilePreview">
      <div :style="mobile_preview_header"><i :style='mobile_preview_header_icon'></i></div>
      <div :style='mobile_preview_frame'>
        <iframe id="Mobile" :src="src" :style='YuFrameMobilePreview' name='YuFrameMobilePreview' ></iframe>
      </div>
      <div :style='mobile_preview_footer'><i :style='mobile_preview_footer_icon'></i></div>
      </div>`,
    props: {
        modelValue: {
            type: String,
            default: "",
        },
        query: {
            type: Object,
            default: function () {
                return {};
            },
        },
    },
    data() {
        return {
            url: this.value,
        };
    },
    computed: {
        src() {
            if (this.modelValue) {
                let str = "";
                for (let key in this.query) {
                    if (str) {
                        str = str + "&" + key + "=" + this.query[key];
                    } else {
                        str = "?" + key + "=" + this.query[key];
                    }
                }
                return h5 + this.modelValue + str;
            } else {
                return "";
            }
        },
        showMobilePreview() {
            //样式
            return {
                width: "391px",
                height: "768px",
                opacity: 1,
                textAlign: "center",
            };
        },
        mobile_preview_header() {
            return {
                display: "block",
                height: "40px",
                width: "387px",
                background: "#eeeff2",
                textAlign: "center",
                lineHeight: "40px",
                borderRadius: "50px 50px 0 0",
            };
        },
        mobile_preview_header_icon() {
            return {
                display: "inline-block",
                width: "65px",
                height: "10px",
                background: "#c8c9cc",
                borderRadius: "9px",
                verticalAlign: "middle",
                marginTop: "18px",
            };
        },
        mobile_preview_frame() {
            return {
                width: "387px",
                minHeight: "294px",
                height: "667px",
                maxHeight: "calc(100vh - 166px)",
                top: "40px",
                border: "6px solid #eeeff2",
                backgroundColor: "#fff",
                display: "block",
            };
        },
        YuFrameMobilePreview() {
            return {
                border: "none",
                width: "375px",
                height: "100%",
                scrollbarWidth: "thin",
                scrollbarColor: "#888 #f1f1f1",
            };
        },
        mobile_preview_footer() {
            return {
                display: "block",
                height: "52px",
                width: "387px",
                backgroundColor: "#eeeff2",
                textAlign: "center",
                lineHeight: "45px",
                borderRadius: "0 0 50px 50px ",
            };
        },
        mobile_preview_footer_icon() {
            return {
                display: "inline-block",
                width: "43px",
                height: "43px",
                background: "#c8c9cc",
                borderRadius: "50%",
                verticalAlign: "middle",
            };
        },
    },
    emits: ['update:modelValue'],
};